<template>
    <div class="message-warp">
        <div class="group">
            <div class="cell-box  flex" v-for="(item,index) in messageList" :key="index">
                <div class="news-box flex">
                   <router-link :to="{path:'/secGoodsDetail',query:{goodsId:item.productId}}">
                        <img :src="item.headimgurl" alt="" class="left">
                            <div class="center">
                                <div class="name-box">{{item.nickname}}</div>
                                <div class="section-line">
                                给你一个赞
                                </div>
                                <!-- <div class="section-line supplement">
                                    <span>{{item.date}}</span>
                                </div> -->
                            </div>
                            <img :src="item.logo" alt="" class="right">
                   </router-link>
                </div>
            </div>
        </div>
        <!-- <div class="bom-tip">请不要相信任何人发送的二维码链接,请勿私下交易谨防被骗</div> -->
    </div>
</template>

<script>
    import {Cell,Group,CellBox,Card,Tab,TabItem} from "vux";
    import axios from '@/api/request'
    export default {
        data() {
            return {
                messageList: [
                    // {
                    //     id: 1, name: '忠实的铲屎官',
                    //     content: '给你一个赞',
                    //     date:'40粉丝',
                    //     avrtar: require('../assets/images/2-avatar.jpg'),
                    //     img: require('../assets/images/2.jpg')
                    // },
                    // {
                    //     id: 2, name: '忠实的铲屎官',
                    //     content: '给你一个赞',
                    //     date:'40粉丝',
                    //     avrtar: require('../assets/images/2-avatar.jpg'),
                    //     img: require('../assets/images/2.jpg')
                    // },
                    // {
                    //     id: 3, name: '忠实的铲屎官',
                    //     content: '给你一个赞',
                    //     date:'40粉丝',
                    //     avrtar: require('../assets/images/2-avatar.jpg'),
                    //     img: require('../assets/images/2.jpg')
                    // },
                ]
            }
        },
        components: {
            TabItem,
            Cell,
            Group,
            CellBox,
            Tab,
        },
        mounted(){
          this.getthumb()
        },
        methods: {
            getthumb(){
                axios('/device/collection/getThumbMe','post',{userId:this.$route.query.userId}).then(res=>{
                   console.log(res)
                  if(res.data.code==1000){
                        this.messageList=res.data.data
                    }
                })
            }
        }
    }
</script>

<style lang="less" scoped>
a{
    display: block;
    display: flex;
}
    .message-warp{
        height: 100%;
        box-sizing: border-box;
        // padding-top: 20rem/75;
        // background: rgb(242,243,247);
    }
    .cell-box:nth-child(1){
        background: #eee;
    }
    .news-box {
        width: 100%;
        background: #fff;
        height: 178rem/75;
        border-bottom: 1rem/37.5 solid #ddd;
        .left {
            width: 100rem/75;
            height: 100rem/75;
            border-radius: 50%;
            margin-left: 35rem/75;
            margin-top: 40rem/75;
        }
        .center {
            width: 410rem/75;
            margin-left: 22rem/75;
            margin-top: 56rem/75;
            margin-left: 30rem/75;
            margin-right: 20rem/75;
            .name-box {
                font-size: 14rem/37.5;
                color: #000;
                font-weight: 600;
            }
            .section-line {
                font-size: 13rem/37.5;
                color: #666;
                margin-top: 6rem/75;
                overflow: hidden;
                text-overflow:ellipsis;
                white-space: nowrap;
            }
            .supplement{
                // display: flex;
                color: #444;
                font-size: 12rem/75;
                justify-content: space-between;
                margin-top: 6rem/75;
                // padding-bottom: 6rem/37.5;
            }
        }
        .right{
            margin-top: 34rem/75;
            width: 118rem/75;
            height: 118rem/75;
            // border-radius: 6px;
        }
    }
    // .cell-box:last-child .news-box{
    //     border-bottom: none;
    // }
    // .bom-tip{
    //     padding-top: 44rem/75;
    //     text-align: center;
    //     color: #999;
    //     font-size: 20rem/75;
    // }
</style>
